import React, { Component } from 'react'
import axios from "axios"
 class Show extends Component {
  constructor(props){ // 类的构造器
    super(props)
    this.state = {
      arr:[]
    }
  }
  componentDidMount(){
    axios.get("/list").then(res=>{
      console.log(res.data);
      // this.state.arr = res.data.list
      this.setState({
        arr:res.data.list
      })
    })
  }
  goDetail(item){
      this.props.history.push({
           pathname:"/detail",
           state:{
              item
           }
      })
  }
  render() {
    return (
      <div>
        {
          this.state.arr&&this.state.arr.length? this.state.arr.map((item,index)=>{
              return <div key={index} onClick={this.goDetail.bind(this,item)}>
                    <h3>{item.title}</h3>
                    <img src={item.img} alt="" />

              </div>
          }):"暂无数据"
          // "暂无数据"这叫处理边界情况
        }
      </div>
    )
  }
}

export default Show